<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>04-promise的链式调用</title>
</head>

<body>

  <script>
    // wanpped into 
    // 网络请求：aaa -> 自己处理（10行）
    // 处理：aaa 拼接   111 => aaa111 =>自己处理（10行）
    // 处理：aaa111 拼接   222 => aaa111222 =>自己处理（10行）


    new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('aaa')
      }, 1000)

    }).then((data) => {
      //  1.第一次的10行处理代码
      console.log(data, "第一次的10行处理代码")

      //  2.对结果第一次处理
      return new Promise(resolve => {
        resolve(data + "111")
      })
    }).then((data) => {
      console.log(data, "第二次的10行处理代码")

      return new Promise(resolve => {
        resolve(data + "222")
      })
    }).then((data) => {
      console.log(data, "第三次的10行处理代码")
    })

    // new Promise(resolve => resolve(结果))简写
    new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('aaa')
      }, 1000)

    }).then((data) => {
      //  1.第一次的10行处理代码
      console.log(data, "第一次的10行处理代码")

      //  2.对结果第一次处理
      return Promise.resolve(data + "111")
    }).then((data) => {
      console.log(data, "第二次的10行处理代码")

      return Promise.resolve(data + "222")
    }).then((data) => {
      console.log(data, "第三次的10行处理代码")
    })


    // 再简写=> 省略Promise ,resolve
    new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('aaa')
      }, 1000)

    }).then((data) => {
      //  1.第一次的10行处理代码
      console.log(data, "第一次的10行处理代码")

      //  2.对结果第一次处理
      return data + "111"
    }).then((data) => {
      console.log(data, "第二次的10行处理代码")

      return data + "222"
    }).then((data) => {
      console.log(data, "第三次的10行处理代码")
    })



    new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('aaa')
      }, 1000)

    }).then((data) => {
      //  1.第一次的10行处理代码
      console.log(data, "第一次的10行处理代码")

      //  2.对结果第一次处理
      // return Promise.resolve(data + "111")

      // 异常
      // return Promise.reject("error message")
      // 手动抛出异常
      throw "error message"

    }).then((data) => {
      console.log(data, "第二次的10行处理代码")

      return Promise.resolve(data + "222")
    }).then((data) => {
      console.log(data, "第三次的10行处理代码")
    }).catch(err => {
      console.log(err);
    })



    // 请求一
    let isResult1 = false
    let isResult2 = false
    $.ajax({
      url: 'url1',
      success: function () {
        console.log('结果一')
        isResult1 = true
        handleResult()
      }
    })


    // 需求 两个请求都有结果再处理
    // 请求二
    $.ajax({
      url: 'url2',
      success: function () {
        console.log('结果二')
        isResult2 = false
        handleResult()
      }
    })

    function handleResult() {
      if (isResult1 && isResult2) {
        // 
      }
    }

    // promise 处理方式 all方法使用
    // Promise.all(数组)
    Promise.all([
      new Promise((resolve, reject) => {
        $.ajax({
          url: 'url1',
          success: function (data) {
            resolve(data)
          }
        })
      }),
      new Promise((resolve, reject) => {
        $.ajax({
          url: 'url2',
          success: function (data) {
            resolve(data)
          }
        })
      })

    ]).then(isResults => {
      isResults[0]
      isResults[1]

    })
  </script>
</body>

</html>